/*--------------------------------------
  Author:      KaNawogirusa
  Email:       xxx@xxx.com
  Created:     2011-07-04
  Description: Stylesheet for example 1
----------------------------------------*/
html, body {
    height: 100%;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: small;
    margin: 0;
}
#map {
    width: 100%;
    height: 100%;
}
#logo{
    
    z-index: 10;
    position: absolute;
margin-top:80%;
    margin-right: 3%;
    margin-bottom: 10%;
    right: 0px;
   
}



		UL.tabNavigation {
		    list-style: none;
		    margin: 0;
		    padding: 0;
		}

		UL.tabNavigation LI {
		    display: inline;
		}

		UL.tabNavigation LI A {
		    padding: 3px 5px;
		    background-color: #ccc;
		    color: #000;
		    text-decoration: none;
		}

		UL.tabNavigation LI A.selected,
		UL.tabNavigation LI A:hover {
		    background-color: #333;
		    color: #fff;
		    padding-top: 7px;
		}

		UL.tabNavigation LI A:focus {
			outline: 0;
		}

		div.tabs > div {
			padding: 5px;
			margin-top: 3px;
			border: 5px solid #333;
		}

		div.tabs > div h2 {
			margin-top: 0;
		}

		#first {
		    background-color: #f00;
		}

		#second {
		    background-color: #0f0;
		}

		#third {
		    background-color: #00f;
		}

		.waste {
			min-height: 1000px;
		}



#botones{
position: relative;
font-family: 'Lucida Grande', 'Lucida Sans Unicode', Arial, sans-serif;
font-size: 12px;
color: white;
margin-top: 12px;
margin-left: 5%;
}

#cerrarmapa{
position: absolute;
font-family: 'Lucida Grande', 'Lucida Sans Unicode', Arial, sans-serif;
font-size: 12px;
color: white;
top: 12px;
right: 285px;
float: right;
cursor: pointer;
}
#abrir{
position: absolute;
font-family: 'Lucida Grande', 'Lucida Sans Unicode', Arial, sans-serif;
font-size: 12px;
color: white;
top: 12px;
right: 285px;
float: right;
cursor: pointer;

}

#barranegra{
    background: url("../img/bg.png");
height: 40px;
width: 99%;
    position: absolute;
    z-index: 8;
}
#ruta{
 
    border-radius: 10px;
    background-color: #dfdede;
    border-right-style: solid;
    border-left-style: solid;
    border-bottom-style: solid;
    border-top-style: solid;
    border-right-width: 2px;
    border-left-width: 2px;
    border-bottom-width: 2px;
    border-top-width: 2px;
    border-right-color: #ffffff;
    border-left-color: #ffffff;
    border-bottom-color: #ffffff;
    border-top-color: #ffffff;
}
#buscador{
 
    border-radius: 10px;
    background-color: white;
    border-right-style: solid;
    border-left-style: solid;
    border-bottom-style: solid;
    border-top-style: solid;
    border-right-width: 2px;
    border-left-width: 2px;
    border-bottom-width: 2px;
    border-top-width: 2px;
    border-right-color: #ffffff;
    border-left-color: #ffffff;
    border-bottom-color: #ffffff;
    border-top-color: #ffffff;
}
#clima{
  
    border-radius: 10px;
    background-color: #dfdede;
    border-right-style: solid;
    border-left-style: solid;
    border-bottom-style: solid;
    border-top-style: solid;
    border-right-width: 2px;
    border-left-width: 2px;
    border-bottom-width: 2px;
    border-top-width: 2px;
    border-right-color: #ffffff;
    border-left-color: #ffffff;
    border-bottom-color: #ffffff;
    border-top-color: #ffffff;
}
#formulario{
    border-radius: 10px;
    background-color: #dfdede;
    border-right-style: solid;
    border-left-style: solid;
    border-bottom-style: solid;
    border-top-style: solid;
    border-right-width: 2px;
    border-left-width: 2px;
    border-bottom-width: 2px;
    border-top-width: 2px;
    border-right-color: #ffffff;
    border-left-color: #ffffff;
    border-bottom-color: #ffffff;
    border-top-color: #ffffff;
}

#tabss{
    width: 300px;
    z-index: 10;
    position: absolute;
    top: 15%;
    right: 3%;
    border-radius: 10px;
    background-color: #dfdede;
    border-right-style: solid;
    border-left-style: solid;
    border-bottom-style: solid;
    border-top-style: solid;
    border-right-width: 2px;
    border-left-width: 2px;
    border-bottom-width: 2px;
    border-top-width: 2px;
    border-right-color: #ffffff;
    border-left-color: #ffffff;
    border-bottom-color: #ffffff;
    border-top-color: #ffffff;
}

#form{
    border-radius: 10px;
    background-color: #dfdede;
    border-right-style: solid;
    border-left-style: solid;
    border-bottom-style: solid;
    border-top-style: solid;
    border-right-width: 2px;
    border-left-width: 2px;
    border-bottom-width: 2px;
    border-top-width: 2px;
    border-right-color: #ffffff;
    border-left-color: #ffffff;
    border-bottom-color: #ffffff;
    border-top-color: #ffffff;
}

#info {
    font-size: 10px;
    width: 185px;
    height:350px;
    background-color: #cccccc;   
    font-family: Verdana,Arial,Helvetica,sans-serif;
}

#info h3 {
    margin-top: 0;
}

#info img {
    width: 185px;
    float: left;
    margin-right: 5px;

}
/*<!---todo lo de el dropdown -->*/

ul{
    margin:0;
    padding:0;
}

ul.container{
    /* The topmost UL */
    width:225px;
    margin:0 auto;

}

li{
    list-style:none;
    text-align:left;
}

li.menu{
    /* The main list elements */
    padding:5px 0;
    width:100%;
}

li.button a{
    /* The section titles */
    display:block;
    font-family:Geneva,Arial,Helvetica,sans-serif;
    font-size:14px;
    height:18px;
    overflow:hidden;
    padding:5px 20px 0;
    position:relative;
    width:185px;
    font-weight: bold;
    background-color: #cccccc;
    vertical-align: middle;
    text-align: left;
}

li.button a:hover{
    /* Removing the inherited underline from the titles */
    text-decoration:none;
}

li.button a span{
    /* This span acts as the right part of the section's background */
    height:44px;
    position:absolute;
    right:0;
    top:0;
    width:4px;
    display:block;
}

/* Setting up different styles for each section color */

li.button a.blue{color:#074384;}
li.button a.green{color:#436800;}
li.button a.orange{color:#882e02;}
li.button a.red{color: #641603;}


/* The hover effects */

li.button a:hover{ background-position:bottom left;}
li.button a:hover span{ background-position:bottom right;}

li.button2 a{
    /* The section titles */
    display:block;
    font-family:Geneva,Arial,Helvetica,sans-serif;
    font-size:14px;
    height:18px;
    overflow:hidden;
    padding:5px 20px 0;
    position:relative;
    width:160px;
    font-weight: bold;
    background-color: #cccccc;
    vertical-align: middle;
    text-align: left;
}

.dropdown{
    /* The expandable lists */
    display:none;
    padding-top:5px;
    width:100%;
}

.dropdown li{
    /* Each element in the expandable list */
    margin:5px 0;
    padding:4px 18px;
}


/* The styles below are only necessary for the demo page */

h1{
    font-family:"Myriad Pro",Arial,Helvetica,sans-serif;
    font-size:36px;
    font-weight:normal;
    margin-bottom:15px;
}

h2{
    font-family:"Myriad Pro",Arial,Helvetica,sans-serif;
    font-size:12px;
    font-weight:normal;
    padding-right:140px;
    right:0;
    text-align:right;
    text-transform:uppercase;
    top:15px;
}

.clear{
    clear:both;
}

#main{
    /* The main container */
    margin:15px auto;
    text-align:center;
    width:920px;
    position:relative;
}

a, a:visited {
    text-decoration:none;
    outline:none;
    color: #000000;
}

/*a:hover{
     background: #999999;
}*/

p{
    /* The tut info on the bottom of the page */
    padding:10px;
    text-align:center;
}			